templateViewInit = ()=>{

    searchFormInfo();
    // 已知数据渲染
    var inst = table.render({
        elem: '#dict-list',
        id:'dict-list-id',
        height: '#content-body-150',
        url: top.tools.getBaseUrl()+'/dict/getTypePage',
        method: 'post',
        headers:{
            'Access-Token':top.tools.cookie.token(),
            'Content-Type':'application/json',
        },
        toolbar: '#dictToolbar',
        defaultToolbar: ['filter', 'exports', 'print', { // 右上角工具图标
            title: '提示',
            layEvent: 'LAYTABLE_TIPS',
            icon: 'layui-icon-tips',
            onClick: function (obj) { // 2.9.12+
                layer.alert('自定义工具栏图标按钮');
            }
        }],
        cols: [
            [
                {type: 'checkbox', width: 50},
                {type: 'numbers', title: '序号', align: 'center', width: 80},
                {field: 'name', title: '字典名称', align: 'left', width: 200, templet:"<a href=\"javascript:;\" class='a-name' onclick=\"openDictData('{{= d.type }}')\">{{= d.name }}</a>" },
                {field: 'type', title: '字典类型', align: 'left',minWidth: 100},
                {field: 'status', title: '状态', align: 'center',width: 100,templet:function (d){
                    return '<input type="checkbox" name="status" id="'+d.id+'" value="'+d.status+'" ' +
                        'title="启用|停用" lay-skin="switch" lay-filter="dict-status" '+( d.status ? "checked" : "" )+'>';
                    }},
                {field: 'remark', title: '备注', align: 'left',minWidth: 100},
                {field: 'createTime', title: '创建时间', align: 'center',width: 160,templet:function (d){
                        return top.tools.form.formatDate(d.createTime);
                    }},
                {fixed: 'right', title: '操作', align: 'center',  width: 180, toolbar: '#barDemo'}
            ]
        ],
        parseData: dataToFormat,
        data:[
            {id:1,name:'用户性别',type:'system_user_sex',status:'0',remark:'',createTime:'2021-01-05 17:03:48'}
        ],
        //skin: 'line', // 表格风格
        //even: true,
        page: true, // 是否显示分页
        limits: [15, 20, 30,50],
        limit: 15, // 每页默认显示的数量
        done: function (res, curr, count) {
            $(".layui-table th[data-field=" + 0 + "] .layui-table-cell").html("");
        }
    });
    // 工具栏事件
    table.on('toolbar(dict-list)', function (obj) {
        var id = obj.config.id;
        var checkRow = table.checkStatus(id);
        var data = checkRow.data;
        if (obj.event === 'add') {
            openForm({
                title:"新增字典",
                btn:1,
                save:(closeid)=>{
                    formFun.save(inst,closeid)
                },
                reset:(closeid)=>{
                    form.val('dict_form', top.tools.form.getFindElementOnObj("#lay-dict-form",false));
                },
                area:'40%'
            },'dict_form')
        } else if (obj.event === 'view') {
            if (checkRow.data.length<=0){
                layer.msg("请选择数据！");
                return
            }
            openForm({
                title:"查看字典",
                btn:-1,
                area:'40%',
                before:(closeid)=>{
                    form.val('dict_form', data);
                }
            },'dict_form')
        } else  if (obj.event === 'del') {
            if (checkRow.data.length<=0){
                layer.msg("请选择数据！");
                return
            }
            let ids = data.map((dict) => dict.id);
            openConfirm(()=>{
                formFun.remove({
                    id:ids.join(',')
                },inst)
            });
        }
    });
    // 触发单元格工具事件
    table.on('tool(dict-list)', function (obj) { // 双击 toolDouble
        var data = obj.data; // 获得当前行数据
        if (obj.event === 'edit') {
            openForm({
                title:"编辑字典",
                btn:1,
                save:(closeid)=>{
                    formFun.save(inst,closeid)
                },
                reset:(closeid)=>{
                    form.val('dict_form', top.tools.form.getFindElementOnObj("#lay-dict-form",false));
                },
                area:'40%',
                before:(closeid)=>{
                    formFun.setValue(data,'dict_form')
                }
            },'dict_form')
        } else if (obj.event === 'view') {
            openForm({
                title:"查看字典",
                btn:-1,
                area:'40%',
                before:(closeid)=>{
                    formFun.setValue(data,'dict_form')
                }
            },'dict_form')
        } else if (obj.event === 'del') {
            openConfirm(()=>{
                formFun.remove(data,inst)
            });
        }
    });


    queryButton('dict-list-id');
    formReset();
    // 状态 - 开关操作
    form.on('switch(dict-status)', function(obj){
        let data = {
            id:$(obj.elem).attr("id"),
            status:obj.elem.checked? 1:0
        }
        top.API.dict().save(data,()=>{
            table.reloadData('dict-list-id', {
                where: {}, // 数据异步请求时携带的字段集 --- 属性设置有效，因属于数据相关属性
                scrollPos: true, // 设定重载数据或切换分页时的滚动条的位置状态 --- 属性设置有效
                page: {
                    curr: inst.config.page.curr,
                    limit: inst.config.page.limit
                }
            });
        })
    });
    form.on('switch(dict-data-status)', function(obj){
        let data = {
            id:$(obj.elem).attr("id"),
            dictType:$(obj.elem).attr("dictType"),
            status:obj.elem.checked? 1:0
        }
        top.API.dict().dictDataSave(data,(res)=>{
            table.cache['dict-data-list-id'] = res.data
            table.renderData('dict-data-list-id');
        })
    });

}

var formFun = {
    save:(dictTypeTable,closeid)=>{
        let formData = top.tools.form.getFindElementOnObj("#lay-dict-form",true);
        if (typeof formData === 'boolean'){
            return;
        }
        if (formData.status && formData.status === 'on' ){
            formData.status = 1;
        }else {
            formData.status = 0;
        }

        top.API.dict().save(formData,(res)=>{
            layer.msg(res.message, {icon: 1}, function(){
                // layer.msg('提示框关闭后的回调');
                if (dictTypeTable){
                    table.reloadData('dict-list-id', {
                        where: {}, // 数据异步请求时携带的字段集 --- 属性设置有效，因属于数据相关属性
                        scrollPos: true, // 设定重载数据或切换分页时的滚动条的位置状态 --- 属性设置有效
                        page: {
                            curr: dictTypeTable.config.page.curr,
                            limit: dictTypeTable.config.page.limit
                        }
                    });
                }
                if (closeid){
                    layer.close(closeid);
                }
            });
        })
    },
    remove:(data,dictTypeTable)=>{
        top.API.dict().del(data,(res)=>{
            layer.msg(res.message, {icon: 1}, function(){
                // layer.msg('提示框关闭后的回调');
                if (dictTypeTable){
                    table.reloadData('dict-list-id', {
                        where: {}, // 数据异步请求时携带的字段集 --- 属性设置有效，因属于数据相关属性
                        scrollPos: true, // 设定重载数据或切换分页时的滚动条的位置状态 --- 属性设置有效
                        page: {
                            curr: dictTypeTable.config.page.curr,
                            limit: dictTypeTable.config.page.limit
                        }
                    });
                }
            });
        })
    },
    dictDataSave:(dictDataTable,closeid)=>{
        let formData = top.tools.form.getFindElementOnObj("#lay-dict-data-form",true);
        if (typeof formData === 'boolean'){
            return;
        }
        if (formData.status && formData.status === 'on' ){
            formData.status = 1;
        }else {
            formData.status = 0;
        }

        top.API.dict().dictDataSave(formData,(res)=>{
            layer.msg(res.message, {icon: 1}, function(){
                // layer.msg('提示框关闭后的回调');
                if (dictDataTable){
                    table.cache['dict-data-list-id'] = res.data
                    table.renderData('dict-data-list-id');
                }
                if (closeid){
                    layer.close(closeid);
                }
            });
        })
    },
    dictDataRemove:(data,dictDataTable)=>{
        top.API.dict().dictDataRemove(data,(res)=>{
            layer.msg(res.message, {icon: 1}, function(){
                // layer.msg('提示框关闭后的回调');
                if (dictDataTable){
                    table.cache['dict-data-list-id'] = res.data
                    table.renderData('dict-data-list-id');
                }
            });
        })
    },
    setValue:(data,eleId)=>{
        data.status = parseInt(data.status);
        form.val(eleId, data);
    }
}

function openDictData(type){

    top.tools.ajax({
        url: '/dict/getDataByDictId',
        type:'post',
        data:{type:type},
        dataType: 'json',
        successFun:function (res){
            if (res.code === 200){
                layer.open({
                    title: '字典数据',
                    type: 1,
                    offset: 'r',
                    anim: 'slideLeft', // 从右往左
                    area: ['65%', '100%'],
                    shade: 0.1,
                    shadeClose: true,
                    move:false,
                    id: 'ID-demo-layer-direction-r',
                    content: '<div style="padding: 16px;"><table class="layui-hide" id="dict-data-list" lay-filter="dict-data-list"></table></div>',
                    success:function (){
                        // 已知数据渲染
                        var dictDataTable = table.render({
                            elem: '#dict-data-list',
                            toolbar: '#dict-data-toolbar',
                            id:"dict-data-list-id",
                            cols: [
                                [
                                    {type: 'checkbox', width: 50},
                                    {type: 'numbers', title: '序号', align: 'center', width: 80},
                                    {field: 'label', title: '字典标签', align: 'left', width: 150},
                                    {field: 'value', title: '字典键值', align: 'center',width: 90},
                                    {field: 'sort', title: '字典排序', align: 'center',width: 90},
                                    {field: 'status', title: '状态', align: 'center',width: 100,templet:function (d){
                                            return '<input type="checkbox" name="status" dictType="'+d.dictType+'" id="'+d.id+'" value="'+d.status+'" ' +
                                                'title="启用|停用" lay-skin="switch" lay-filter="dict-data-status" '+( d.status ? "checked" : "" )+'>';
                                        }},
                                    {field: 'colorType', title: '颜色类型', align: 'center',width: 90},
                                    {field: 'cssClass', title: 'CSS Class', align: 'center',width: 110},
                                    {field: 'remark', title: '备注', align: 'left',minWidth: 100},
                                    {field: 'createTime', title: '创建时间', align: 'center',width: 160,templet:function (d){
                                            return top.tools.form.formatDate(d.createTime);
                                        }},
                                    {fixed: 'right', title: '操作', align: 'center',  width: 170, toolbar: '#barDemo'}
                                ]
                            ],
                            data:res.data || [
                                {id:'1',sort:'1',label:'男',value:'1',dict_type:'system_user_sex',status:'0',colorType:'default',cssClass:'default',remark:'性别男',createTime:'2021-01-05 17:03:48'},
                                {id:'2',sort:'2',label:'女',value:'2',dict_type:'system_user_sex',status:'0',colorType:'default',cssClass:'default',remark:'性别男',createTime:'2021-01-05 17:03:48'}
                            ],
                            done: function (res, curr, count) {
                                $(".layui-table th[data-field=" + 0 + "] .layui-table-cell").html("");
                            }
                        });

                        // 工具栏事件
                        table.on('toolbar(dict-data-list)', function (obj) {
                            var id = obj.config.id;
                            var checkRow = table.checkStatus(id);
                            var initData = {
                                dictType:type,
                                status:1,
                                sort:table.cache['dict-data-list-id'].length+1
                            }
                            var data = checkRow.data;
                            if (obj.event === 'add') {
                                openForm({
                                    title:"新增字典值",
                                    btn:1,
                                    save:(closeid)=>{
                                        formFun.dictDataSave(dictDataTable,closeid)
                                    },
                                    reset:(closeid)=>{
                                        form.val('dict_data_form', top.tools.form.getFindElementOnObj("#lay-dict-data-form",false));
                                    },
                                    before:(closeid)=>{
                                        formFun.setValue(initData,'dict_data_form')
                                    },
                                    area:'40%'
                                },'dict_data_form')
                            } else if (obj.event === 'view') {
                                if (checkRow.data.length<=0 ){
                                    layer.msg("请选择数据！");
                                    return
                                }
                            } else  if (obj.event === 'del') {
                                if (checkRow.data.length<=0 ){
                                    layer.msg("请选择数据！");
                                    return
                                }

                            }
                        });

                        // 触发单元格工具事件
                        table.on('tool(dict-data-list)', function (obj) { // 双击 toolDouble
                            var data = obj.data; // 获得当前行数据
                            if (obj.event === 'edit') {
                                openForm({
                                    title:"编辑字典值",
                                    btn:1,
                                    save:(closeid)=>{
                                        formFun.dictDataSave(dictDataTable,closeid)
                                    },
                                    reset:(closeid)=>{
                                        form.val('dict_data_form', top.tools.form.getFindElementOnObj("#lay-dict-data-form",false));
                                    },
                                    area:'40%',
                                    before:(closeid)=>{
                                        formFun.setValue(data,'dict_data_form')
                                    }
                                },'dict_data_form')
                            } else if (obj.event === 'view') {
                                openForm({
                                    title:"查看字典值",
                                    btn:-1,
                                    area:'40%',
                                    before:(closeid)=>{
                                        formFun.setValue(data,'dict_data_form')
                                    }
                                },'dict_data_form')
                            } else if (obj.event === 'del') {
                                openConfirm(()=>{
                                    formFun.dictDataRemove(data,dictDataTable)
                                });
                            }
                        });
                    }
                });
            }
        }
    })
}